<!-- 首页 最新数据 -->
<template>
  <div class="lpl-user">
    <div class="tit">
        最新拼单
    </div>
    <div class="tab-tou">
      <table>
        <tr >
          <th align="left" style="padding:0px 0px 0px 14px;">姓名</th>
          <th align="center">手机号</th>
          <th align="center">车型</th>
          <th align="right" style="padding:0px 14px 0px 0px;">时间</th>
        </tr>
      </table>
    </div>
    <div class="neir swiper-container" id="v" v-if="data.length">
        <div class="swiper-wrapper">
            <!-- <div class="swiper-slide">
            </div> -->
            <div class="swiper-slide" v-for=" (key,index) in data" >
              <table>
                <tr v-for=" value in key">
                  <td align="left" style="padding:0px 0px 0px 14px;">{{value.name}}</td>
                  <td align="center">{{value.mobile}}</td>
                  <td align="center">{{value.car}}</td>
                  <td align="right" style="padding:0px 14px 0px 0px;">{{value.pastTime}}</td>
                </tr>
              </table>
            </div>
            <!-- <div class="swiper-slide">
              <table>
                <tr>
                  <td align="left" style="padding:0px 0px 0px 14px;">沈团友546545646546546</td>
                  <td align="center">18******5</td>
                  <td align="center">凯美瑞</td>
                  <td align="right" style="padding:0px 14px 0px 0px;">12分钟前</td>
                </tr>
                <tr>
                  <td align="left" style="padding:0px 0px 0px 14px;">沈团友546545646546546</td>
                  <td align="center">18******5</td>
                  <td align="center">凯美瑞</td>
                  <td align="right" style="padding:0px 14px 0px 0px;">12分钟前</td>
                </tr>
                <tr>
                  <td align="left" style="padding:0px 0px 0px 14px;">沈团友546545646546546</td>
                  <td align="center">18******5</td>
                  <td align="center">凯美瑞</td>
                  <td align="right" style="padding:0px 14px 0px 0px;">12分钟前</td>
                </tr>
                <tr>
                  <td align="left" style="padding:0px 0px 0px 14px;">沈团友546545646546546</td>
                  <td align="center">18******5</td>
                  <td align="center">凯美瑞</td>
                  <td align="right" style="padding:0px 14px 0px 0px;">12分钟前</td>
                </tr>
                <tr>
                  <td align="left" style="padding:0px 0px 0px 14px;">沈团友546545646546546</td>
                  <td align="center">18******5</td>
                  <td align="center">凯美瑞</td>
                  <td align="right" style="padding:0px 14px 0px 0px;">12分钟前</td>
                </tr>
                <tr>
                  <td align="left" style="padding:0px 0px 0px 14px;">沈团友546545646546546</td>
                  <td align="center">18******5</td>
                  <td align="center">凯美瑞</td>
                  <td align="right" style="padding:0px 14px 0px 0px;">12分钟前</td>
                </tr>
              </table>
            </div>
            <div class="swiper-slide">
              <table>
                <tr>
                  <td align="left" style="padding:0px 0px 0px 14px;">沈团友546545646546546</td>
                  <td align="center">18******5</td>
                  <td align="center">凯美瑞</td>
                  <td align="right" style="padding:0px 14px 0px 0px;">12分钟前</td>
                </tr>
                <tr>
                  <td align="left" style="padding:0px 0px 0px 14px;">沈团友546545646546546</td>
                  <td align="center">18******5</td>
                  <td align="center">凯美瑞</td>
                  <td align="right" style="padding:0px 14px 0px 0px;">12分钟前</td>
                </tr>
                <tr>
                  <td align="left" style="padding:0px 0px 0px 14px;">沈团友546545646546546</td>
                  <td align="center">18******5</td>
                  <td align="center">凯美瑞</td>
                  <td align="right" style="padding:0px 14px 0px 0px;">12分钟前</td>
                </tr>
                <tr>
                  <td align="left" style="padding:0px 0px 0px 14px;">沈团友546545646546546</td>
                  <td align="center">18******5</td>
                  <td align="center">凯美瑞</td>
                  <td align="right" style="padding:0px 14px 0px 0px;">12分钟前</td>
                </tr>
                <tr>
                  <td align="left" style="padding:0px 0px 0px 14px;">沈团友546545646546546</td>
                  <td align="center">18******5</td>
                  <td align="center">凯美瑞</td>
                  <td align="right" style="padding:0px 14px 0px 0px;">12分钟前</td>
                </tr>
                <tr>
                  <td align="left" style="padding:0px 0px 0px 14px;">沈团友546545646546546</td>
                  <td align="center">18******5</td>
                  <td align="center">凯美瑞</td>
                  <td align="right" style="padding:0px 14px 0px 0px;">12分钟前</td>
                </tr>
              </table>
            </div> -->
        </div>
        <!-- 如果需要分页器 -->
         <!-- <div class="swiper-pagination"></div>  -->
        <!-- 如果需要导航按钮 -->
        <!-- <div class="swiper-button-prev"></div> -->
        <!-- <div class="swiper-button-next"></div> -->
        <!-- 如果需要滚动条 -->
        <!-- <div class="swiper-scrollbar"></div> -->
    </div>
  </div>
</template>

<script>
import Swiper from 'static/js/swiper'
import {findSharedCustomer} from '@/nodeApi/count'
export default {
  components: {},
  data () {
    return {
      data:[],
    
    }
  },
  props: {},
  watch: {},
  methods: {
    back () {
      this.$emit('back')
    },
    split_array(arr, len){
      var a_len = arr.length;
      var result = [];    
      for(var i=0;i<a_len;i+=len){        
        result.push(arr.slice(i,i+len));    
      }    
      return result;
    }
  },
  filters: {},
  computed: {},
  created () {
    findSharedCustomer().then(res=>{
      this.data = this.split_array(res.data.sharedCustomer, 6)
      ////console.log(this.data)
      this.$nextTick(()=>{
      new Swiper ('#v', {
        direction: 'vertical',
        loop:true,
        autoplay: {
          disableOnInteraction: false,
        },
        observer:true,
        observeParents:true,
        on: {
          touchEnd: function(event){
            //你的事件
          }
        }
      })   
    })  
      
    })
  },
  mounted () {
    
  },
  updated() {
    
  },
}
</script>

<style lang="scss" scoped>
@import '~@/assets/scss/const.scss';
@import '~@/assets/scss/mixin.scss';
.lpl-user{
  height:auto;
  /* border:1px solid red; */
  background:#fff;
  .tab-tou{
    height:41px;
    border-bottom:1px solid #E9E9E9;  
    width:100%;
    background:#F5F5F5;
    table{
      width:100%;
      table-layout: fixed;
        tr{
          width:100%;
          th{
            width:25%;
            height:41px;
          }
        }
    }
  }
  .tit{
    height:40px;
    width:100%;
    /* border:1px solid red;  */
    text-align:center;
    font-size:15px;
    line-height:40px;
  }
  .neir{
    font-size:12px;
    height:241px;
    width:100%;
    border-bottom:1px solid #E9E9E9; 
    margin-top:-1px;
    overflow:hidden;
    table{
      width:100%;table-layout: fixed;
        tr{
          width:100%;border-bottom:1px solid #E9E9E9;
          td{
            width:25%;
            height:40px;
            overflow:hidden;		/* 内容超出宽度时隐藏超出部分的内容 */ 
            white-space:nowrap;		/* 不换行 */
            text-overflow:ellipsis;
          }
        }
    }		
  }
}

</style>
